<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script src="yui/3.4.1/build/yui/yui-min.js"></script>
<script src="yui/gallery-2011.02.09-21-32/build/gallery-progress-bar/gallery-progress-bar.js"></script>
<style type="text/css">

.progressbars {
	width:300px;
}

.yui3-progressbar {
	margin-bottom:3px;
	border: 2px solid #c4c4c4;
	border-radius:5px;
	-moz-border-radius: 5px;
	-webkit-border-radius:5px;
}
.yui3-progressbar .yui3-progressbar-content {
	background-color:#fff;
	position:relative;
/*	width: 200px; */
}
.yui3-progressbar .yui3-progressbar-label {
	position: absolute;
	top:1px;
	left:3px;
	font-size:11px;
	font-family:Arial,Helvetica,sans-serif;
}
.yui3-progressbar .yui3-progressbar-slider {
	background-color:#e0bb30;
	height: 15px;
	line-height: 29px;
	width: 0;
}

#selectFilesLink #selectLink,
#uploadFilesLink #uploadLink {
    color: #00c;
    text-decoration: underline;
}
</style>
</head>
<body>
<script type="text/javascript">
YUI().use('gallery-progress-bar',function(Y){
Y.on('domready',function(){
    var pb1 = new Y.ProgressBar({
          render: true, 
          layout : '<div class="{labelClass}"></div><div class="{sliderClass}"></div>'
    });
    pb1.setLabelAt(50, 'Initializing');

    (function upIt() {
        var p = pb1.get('progress');
        if(p <= 100) {
            Y.later(1000, this, function(e){
                pb1.increment(8.4);
                upIt();
            });
        }
    })();
});
});
</script>
</body>
</html>